<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <title>订单系统-{{$title}}</title>
  <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">

<!--   <link rel="stylesheet" href="{{asset('bootstrap/css/bootstrap.min.css')}}"> -->
 <!--  <script type="text/javascript" src="{{asset('bootstrap/js/bootstrap.min.js')}}"></script> -->


  <!-- <link rel="stylesheet" href="{{asset('ionicons/css/ionicons.min.css')}}"> -->
<!--   <link rel="stylesheet" href="{{asset('adminlte/css/skins/_all-skins.css')}}"> -->
  <!-- <link rel="stylesheet" href="{{asset('mdui/css/mdui.css')}}"> -->
 
  <link rel="stylesheet" href="{{asset('eui/lib/theme-default/index.css')}}">
  <script type="text/javascript" src="{{asset('vue/dist/vue.min.js')}}"></script>
  <script src="{{asset('vue-resource/dist/vue-resource.min.js')}}"></script>
  <script type="text/javascript" src="{{asset('eui/lib/index.js')}}"></script>
  <!-- <script type="text/javascript" src="{{asset('mdui/js/mdui.min.js')}}"></script> -->
  <script type="text/javascript" src="{{asset('iview/dist/iview.js')}}"></script>
 <!--  <script src="https://unpkg.com/element-ui/lib/index.js"></script>
  <link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-default/index.css">  -->
  <link rel="stylesheet" href="{{asset('eui/lib/theme-default/table.css')}}"> 
  <link rel="stylesheet" href="{{asset('eui/lib/theme-default/dialog.css')}}"> 
  <link rel="stylesheet" href="{{asset('iview/dist/styles/iview.css')}}"> 
<!--   <script type="text/javascript" src="{{asset('jquery/dist/jquery.min.js')}}"></script>
  <script type="text/javascript" src="{{asset('adminlte/js/app.min.js')}}"></script> -->



<style type="text/css">
  [v-cloak] {
display: none;
} 


.skin-blue-light .sidebar-menu > li.active > a {
    font-weight: 400; 
}

.skin-blue-light .sidebar-menu > li > a {
   font-weight: 400; 
}
  .avatar-uploader .el-upload {
    border: 1px dashed #d9d9d9;
    border-radius: 6px;
    cursor: pointer;
    position: relative;
    overflow: hidden;
  }
  .avatar-uploader .el-upload:hover {
    border-color: #20a0ff;
  }
  .avatar-uploader-icon {
    font-size: 28px;
    color: #8c939d;
    width: 164px;
    height: 164px;
    line-height: 164px;
    text-align: center;
  }
  .avatar {
    width: 100px;
    height: 100px;
    display: block;
  }
  .avatar1 {
    width: 164;
    height: 164px;
    display: block;
  }
   .el-row {
     margin-top: 5px;
    margin-bottom: 5px;
    &:last-child {
      margin-bottom: 0;
    }
  }
  .el-select {
    width: 180px;
  }
  .el-input {
    width: 180px;
  }
  .el-input-number{
     width: 180px;
  }

  hr {
    border: 0;
    height: 0;
    border-top: 1px solid rgba(0, 0, 0, 0.1);
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}


.layout{
       
        background: #f5f7f9;
        padding: 0;
        margin: 0;
        position: absolute;
        left: 0;
        top: 0;
        bottom: 0;
        right: 0;
 
    }
    .layout-breadcrumb{
        padding: 10px 15px 0;
    }
    .layout-content{
        min-height: 200px;
        margin: 0px;
        overflow: hidden;
        background: #fff;
        border-radius: 4px;
        min-height: 800px
    }
    .layout-content-main{
        padding: 10px;
    }
    .layout-copy{
        text-align: right;
        padding: 10px 0 20px;
        color: #9ea7b4;
    }
    .layout-menu-left{
     
    }
    .layout-header{
        height: 45px;
        background: #fff;
        box-shadow: 0 1px 1px rgba(0,0,0,.1);
    }
    .layout-logo-left{
        width: 95%;
        height: 30px;
        color: #3c8dbc;
        text-align: center;
        border-radius: 3px;
        margin-bottom: 5px;
        margin-top:10px;
        margin-left: -15px;
    }
    .el-submenu .el-menu-item {
    min-width: 160px;
    }
    [class^="el-icon-my"], [class*=" el-icon-my"] {

      /* 以下内容参照第三方图标库本身的规则 */
      font-size: inherit;
      font-style:normal;
      -webkit-font-smoothing: antialiased;
      -moz-osx-font-smoothing: grayscale;
    }

.el-menu--horizontal .el-menu-item {
    float: left;
    height: 45px;
    line-height: 45px;
    margin: 0;
    cursor: pointer;
    position: relative;
    box-sizing: border-box;
    border-bottom: 5px solid transparent;
}
.el-menu--horizontal .el-submenu .el-submenu__title {
    height: 45px;
    line-height: 45px;
    border-bottom: 5px solid transparent;
}


</style>

@yield('pagecss')
</head>
<body  >

<div class="layout" >
    <div  id="sidebar" v-cloak style="width: 160px;float: left;height: 100%" class="layout-menu-left">
     <div  class="layout-logo-left"><h2>订单系统</h2></div>
      <div  >
        @if (Auth::guest())
        @else
        <el-menu theme="light" :default-active="2" class="el-menu-demo" mode="horizontal" @select="userClick" >
           <el-submenu index="2" style="width: 100%">
            <template slot="title" ><Icon type="android-person" size="20" style="margin-right: 5px" ></Icon>{{ Auth::user()->name }}</template>
            <el-menu-item index="logout">退出</el-menu-item>
          </el-submenu>
        </el-menu>
           
        @endif 
        
      </div>
           
        <el-menu default-active="{{$actice or ''}}"  class="el-menu-vertical-demo" @select="goToUrl">
          @if(isset($urls))
                @foreach($urls as $url)
                    @if( $url->parent == 1 and $url->rank == 0 ) 
                    <el-submenu index="{{$url->url}}">
                    <template slot="title"><Icon type="{{$url->ico}}" size="18" style="margin-bottom: 5px;margin-right: 5px" ></Icon>{{$url->name}}</template>
                        @foreach($urls as $url2)
                                @if($url2->pid == $url->id)
                                     <el-menu-item index="{{$url2->url}}"><Icon type="{{$url2->ico}}" size="18" style="margin-bottom: 5px;margin-right: 5px" ></Icon>{{$url2->name}}</el-menu-item>
                                @endif
                        @endforeach
                    </el-submenu>
                    @elseif( $url->parent == 0 and $url->rank == 0 )
                     <el-menu-item index="{{$url->url}}"><Icon type="{{$url->ico}}" size="18" style="margin-bottom: 5px;margin-right: 5px" ></Icon>{{$url->name}}</el-menu-item>
                    @else
                    @endif
                @endforeach
            @endif
        </el-menu>
    </div>
    <div class="layout-content">
        <div class="layout-header" id="header">
         <div  v-cloak id="content-header">
             <el-menu theme="light" :default-active="activeIndex" class="el-menu-demo" mode="horizontal" @select="handleSelect">
                <el-menu-item index="1">{{$title}}</el-menu-item>
              </el-menu>
          </div>
          <script type="text/javascript">

            var layoutheader =new Vue({
                  el:'#content-header',
                  data:{
                  activeIndex: '1',
                  },
                  created:function(){      
                         
                  },

                  methods:{
                         handleSelect(key, keyPath) {
                        console.log(key, keyPath);
                      }
                  },

            });
          </script>
        </div>
        <div class="layout-content-main">
           @yield('content')
        </div>
    </div>
    <div class="layout-copy">
        2011-2016 &copy; TalkingData
    </div>
</div>

<script >
    var vm =new Vue({
        el:'#sidebar',
        data:{
          userV:false,

        },
        created:function(){      
               
        },

        methods:{
          logout:function(){
             this.$notify.info('退出成功');
             this.$http.get('logout').then((response) => {  },(response) =>{ window.location.reload(); }); 
          },
          userClick:function(val){
            console.log(val);
            if(val == 'logout'){
              this.$notify.info('退出成功');
              this.$http.get('logout').then((response) => {  },(response) =>{ window.location.reload(); }); 

            }
          },
          goToUrl:function(val){
              console.log(val);
              window.location.href=val;
          },
        },

  });
    
</script>

@yield('pagejs')
</body>
</html>
